body {

    background-color: #000;
}

main {
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;

    .video-st {
        position: relative;
        align-self: center;
        display: flex;
        justify-content: center;

        flex: 1;
        width: 100%;

        video {
            width: 100%;

        }

        .video-pro {
            font-size: 50px;

            p {
                font-size: 20px;
            }

            position: absolute;
            bottom: 40px;
            left: 25px;
            color: #fff;
        }
    }

    .footer {
        position: relative;
        background-color: #fff;
        width: 100%;
        padding: 20px 0;
        text-align: center;
        align-self: center;
        display: flex;


        .menu-bar {
            display: flex;
            width: 100%;
            height: 100%;
            justify-content: space-around;
            flex: 1;
           span{
               z-index: 2;
                position: relative;
                font-size: 40px;
           }
        }

        .pro-bar {
            z-index: 1;
            top: 0;
            background-color: aquamarine;
            position: absolute;
            height: 120%;
            width: 0%;

        }

    }



}

.stop-mask {
    z-index: 10;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: skyblue;
    color: #fff;

    display: flex;
    justify-content: space-between;
    flex-direction: column;

    .c-img {
        width: 100px;
        height: 80px;
    }

    .stop-menu {
        width: 100%;
        flex: 1;
        display: flex;
        align-self: center;
        justify-content: center;
        flex-direction: column;

        .menu {
            width: 100%;
            display: flex;
            justify-content: space-around;

        }
    }

    .tit-sport {

        overflow: hidden;
        display: flex;
        border-radius: 10px;
        height: 60;
        border: 2px solid #fff;
        justify-content: space-between;
        align-self: center;
        margin-top: 30px;

        .tit-right {

            text-align: center;
            display: flex;
            justify-content: space-around;
            flex-direction: column;
            padding: 0 10px;
            width: 100%;

        }

    }

    .stop-tit {
        margin-top: 15px;
        font-size: 24px;
        padding: 10px 15px;
    }

}